{% load book_extras %}
    <nav class="pcoded-navbar">
        <div class="navbar-wrapper">
            <div class="navbar-brand header-logo">
                <a target="_blank" 
                   href="" class="b-brand">
                    <div class="b-bg">
                        <i class="feather icon-trending-up"></i>
                    </div>
                    <span class="b-title">Library XXX</span>
                </a>
                <a class="mobile-menu" id="mobile-collapse" href="javascript:"><span></span></a>
            </div>
            <div class="navbar-content scroll-div">
                <ul class="nav pcoded-inner-navbar">
                    <li class="nav-item pcoded-menu-caption">
                        <label>Menu</label>
                    </li>
                    <li 
                        class="nav-item {% if 'index' in segment %} active {% endif %}">
                        <a href="/" class="nav-link "><span class="pcoded-micon"><i class="feather icon-home"></i></span><span class="pcoded-mtext">Dashboard</span></a>
                    </li>
                    <li 
                        class="nav-item {% if request.resolver_match.url_name == 'chart' %} active {% endif %}">
                        <a href="{% url 'chart' %}" class="nav-link "><span class="pcoded-micon"><i class="feather icon-home"></i></span><span class="pcoded-mtext">Charts</span></a>
                    </li>
                    
                    <!-- Borrow List -->
                    <li class="nav-item pcoded-menu-caption">
                        <label>Borrow records</label>
                    </li>
                    <li class="nav-item {% if request.resolver_match.url_name == 'record_list' %} active {% endif %}">
                        <a href="{% url 'record_list' %}" class="nav-link "><span class="pcoded-micon"><i class="feather icon-file-text"></i></span><span class="pcoded-mtext">All Records</span></a>
                    </li>

                    <li   class="nav-item {% if request.resolver_match.url_name == 'record_create' %} active {% endif %}">
                    <a href="{% url 'record_create' %}" class="nav-link "><span class="pcoded-micon"><i class="feather icon-file-text"></i></span><span class="pcoded-mtext">Lend Book</span></a>
                </li>

                    <!-- Manage Books -->

                    <li class="nav-item pcoded-menu-caption">
                        <label>Management</label>
                    </li>
                    <li class="nav-item pcoded-hasmenu {% if request.resolver_match.url_name == 'book_list' or request.resolver_match.url_name == 'book_create' or request.resolver_match.url_name == 'book_update' or request.resolver_match.url_name == 'book_delete' or request.resolver_match.url_name == 'book_detail' %} active pcoded-trigger {% endif %}">
                        <a href="javascript:" class="nav-link "><span class="pcoded-micon"><i class="feather icon-box"></i></span><span class="pcoded-mtext">Books</span></a>
                        <ul class="pcoded-submenu">
                            <li class=""><a href="{% url 'book_list' %}" class="">All books</a></li>
                            <li class=""><a href="{% url 'book_create' %}" class="">Add book</a></li>
                        </ul>
                    </li>

                    <!-- Management Category -->
                    {% url 'category_list' as category_list %}
                    {% url 'category_create' as category_create %}
                    {% url 'category_delete' as category_delete %}
                    <li class="nav-item pcoded-hasmenu {% if request.path == category_list or request.path == category_create or  request.path == category_delete %} active pcoded-trigger {% endif %}">
                        <a href="javascript:" class="nav-link "><span class="pcoded-micon"><i class="feather icon-box"></i></span><span class="pcoded-mtext">Categories</span></a>
                        <ul class="pcoded-submenu">
                            <li class=""><a href="{% url 'category_list' %}" class="">All Categories</a></li>
                            <li class=""><a href="{% url 'category_create' %}" class="">Add Category</a></li>
                        </ul>
                    </li>

                    <!-- Management Publisher -->

                    <li class="nav-item pcoded-hasmenu {% if request.resolver_match.url_name == 'publisher_list' or request.resolver_match.url_name == 'publisher_create' or request.resolver_match.url_name == 'publisher_update' or request.resolver_match.url_name == 'publisher_delete' %} active pcoded-trigger {% endif %}">
                        <a href="javascript:" class="nav-link "><span class="pcoded-micon"><i class="feather icon-box"></i></span><span class="pcoded-mtext">Publishers</span></a>
                        <ul class="pcoded-submenu">
                            <li class=""><a href="{% url 'publisher_list' %}" >All Publishers</a></li>
                            <li class=""><a href="{% url 'publisher_create' %}" >Add Publisher</a></li>
                        </ul>
                    </li>


                    <!-- Membership  -->
                    <li class="nav-item pcoded-hasmenu {% if request.resolver_match.url_name == 'member_list' or request.resolver_match.url_name == 'member_create' or request.resolver_match.url_name == 'member_update' or request.resolver_match.url_name == 'member_delete' or request.resolver_match.url_name == 'member_detail' %} active pcoded-trigger {% endif %}">
                        <a href="javascript:" class="nav-link "><span class="pcoded-micon"><i class="feather icon-box"></i></span><span class="pcoded-mtext">Membership</span></a>
                        <ul class="pcoded-submenu">
                            <li class=""><a href="{% url 'member_list' %}" class="">All Members</a></li>
                            <li class=""><a href="{% url 'member_create' %}" class="">Add Member</a></li>
                        </ul>
                    </li>

                    <!-- User Logs -->
   
                    {% url 'profile_create' as profile_create %}
                    <li class="nav-item pcoded-menu-caption">
                        <label>User Admin</label>
                    </li>
                    {% if request.user.profile.id %}
                    <li  class="nav-item {% if request.resolver_match.url_name == 'profile_detail' %} active  {% endif %}">
                        <a href="{% url 'profile_detail' request.user.profile.id %}" class="nav-link "><span class="pcoded-micon"><i class="feather icon-file-text"></i></span><span class="pcoded-mtext">My Profile</a>
                    </li>
                    <li  class="nav-item {% if request.resolver_match.url_name == 'profile_update' %} active {% endif %}">
                        <a href="{% url 'profile_update' request.user.profile.pk %}" class="nav-link "><span class="pcoded-micon"><i class="feather icon-file-text"></i></span><span class="pcoded-mtext">Update Profile</a>
                    </li>
                    {% else %}
                    <li  class="nav-item {% if request.resolver_match.url_name == 'profile_create' %} active  {% endif %}">
                        <a href="{% url 'profile_create' %}" class="nav-link "><span class="pcoded-micon"><i class="feather icon-file-text"></i></span><span class="pcoded-mtext">Create Profile</a>
                    </li>

                    {% endif %}


                    {% if request.user|has_group:"logs" %}
                    <li  class="nav-item {% if request.resolver_match.url_name == 'user_activity_list' %} active {% endif %} {% if request.resolver_match.url_name == 'user_activity_delete' %} active {% endif %}">
                        <a href="{% url 'user_activity_list' %}" class="nav-link "><span class="pcoded-micon"><i class="feather icon-file-text"></i></span><span class="pcoded-mtext">Logs</a>
                    </li>
                    {% endif %}

                    {% if request.user|has_group:"download_data" %}
                    <li  class="nav-item {% if request.resolver_match.url_name == 'data_center' %} active {% endif %}">
                        <a href="{% url 'data_center' %}" class="nav-link "><span class="pcoded-micon"><i class="feather icon-file-text"></i></span><span class="pcoded-mtext">Data Center</a>
                    </li>
                    {% endif %}

                    
                    {% if request.user|has_group:"api" %}
                    <li  class="nav-item {% if request.resolver_match.url_name == 'api-overview' %} active {% endif %}">
                        <a href="{% url 'api-overview' %}" class="nav-link "><span class="pcoded-micon"><i class="feather icon-file-text"></i></span><span class="pcoded-mtext">API</a>
                    </li>
                    {% endif %}

                    {% if request.user.is_superuser %}
                    <li  class="nav-item {% if request.resolver_match.url_name == 'employees_list' %} active {% endif %}">
                        <a href="{% url 'employees_list' %}" class="nav-link "><span class="pcoded-micon"><i class="feather icon-file-text"></i></span><span class="pcoded-mtext">Employees</a>
                    </li>
                    {% endif %}

                    <!-- Form Table -->
                    <!-- <li class="nav-item pcoded-menu-caption">
                        <label>Forms & table</label>
                    </li>
                    <li data-username="form elements advance componant validation masking wizard picker select" 
                        class="nav-item {% if 'ui-forms' in segment %} active {% endif %}">
                        <a href="/ui-forms.html" class="nav-link "><span class="pcoded-micon"><i class="feather icon-file-text"></i></span><span class="pcoded-mtext">Form elements</span></a>
                    </li>
                    <li data-username="Table bootstrap datatable footable" 
                        class="nav-item {% if 'ui-tables' in segment %} active {% endif %}">
                        <a href="/ui-tables.html" class="nav-link "><span class="pcoded-micon"><i class="feather icon-server"></i></span><span class="pcoded-mtext">Table</span></a>
                    </li> -->

                </ul>
            </div>
        </div>
    </nav>
